<template>
  <div class="container login">
    <div class="login-com">
    <div class="user-pic-row">
      <img class="user-pic" src="https://wx.qlogo.cn/mmopen/vi_32/4YcSBHO9jZzK0icZXuprLZZveFzP1euB6NOw9FWsjrmRWX2jficNvTR9Y5dKsjnvQXTpAlWecyV5lmvK8yo9YPWA/132" alt="">
    </div>
    <div class="logo-name">上海井亭生活广场</div>
    <div class="desc">
      网页由该公众号开发，请确认授权以下信息
    </div>
    <div class="desc-tip">
      获得你的公开信息（昵称、头像等）
    </div>
    <div class="login-btn-row">
        <van-button type="danger" class="login-btn">确认授权</van-button>
    </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'authorization',
  props: {
    msg: String
  },
  methods: {    
    onLoad() {  
      this.$api.login.userLogin({        
          api: 123      
      }).then(res=> {
        console.log(res);   
      })    
    }  
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
.login {
  background-color: #f5f5f5;
  .van-nav-bar__title {
    color: #fff;
  }
  .login-com {
    padding: .533333rem;
  }
  .user-pic-row {
    margin-top: 1.6rem;
    padding-bottom: .266667rem;
    text-align: center;
  }
  .logo-name{
    text-align: center;
    font-size: .48rem;
    color: #333;
  }
  .desc{
    font-size: .373333rem;
    color: #333;
    margin-top: .8rem;
    margin-bottom: .133333rem;
  }
  .desc-tip{
    font-size: .373333rem;
    color: #999;
  }
  .user-pic {
    border-radius: 50%;
    height: 2.133333rem;
    width: 2.133333rem;
  }
  .login-btn-row {
    text-align: center;
    margin-top: .533333rem;
    .login-btn {
      width: 100%;
      margin-top: .533333rem;
      border-radius: .106667rem;
    }
  }
}
</style>